<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <!-- <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"> -->
    <!-- Safari为meta标签新增minimal-ui属性，在网页加载时隐藏地址栏与导航栏 -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minxmum-scale=1.0, user-scalable=no, minimal-ui">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta name="format-detection" content="telephone=no">
    <meta name="full-screen" content="yes">
    <meta name="x5-fullscreen" content="true">
    <meta http-equiv="Pragma" content="no-cache">
    <meta http-equiv="Cache-control" content="no-cache">
    <meta http-equiv="Cache" content="no-cache">
    <title>东湖绿道</title>
    <link rel="stylesheet" href="<?=HW_STA?>weixin/css/weuix.min.css"/>
    <link rel="stylesheet" type="text/css" href="<?=HW_STA?>weixin/css/style.css">
	<link rel="stylesheet" href="<?=HW_CSS?>AppFont/iconfont.css">
	<link rel="stylesheet" href="https://res.wx.qq.com/open/libs/weui/0.4.0/weui.min.css">

</head>
<body>
	<div class="index">
		<div class="index-panel add_img" style="">
			<div class="index-panel__user">
				<div class="index-panel__user-avatar">
					<img src="<?=$info['headimgurl']?>" alt="">
				</div>
				<div class="index-panel__user-username">
					<span><?=$info['nickname']?></span>
				</div>
			</div>
		</div>
		<a class="index-step index-flex white-bg" href='<?=base_url().'Weixin/Index/step'?>'>
			<div class="flex-left">
				当前步数
			</div>
			<div class="flex-right grey">
				<span class="green"><?=$step['step']?></span>步<i class='iconfont'>&#xe80f;</i>
			</div>
		</a>
		<div class="index-statictis white-bg">
			<div class="index-statictis__item">
				<div class="index-statictis__item-up grey">
					时长
				</div>
				<div class="green index-statictis__item-down">
					<?=date('H:i:s',strtotime('Y-m-d')+$step['time'])?>
				</div>
			</div>
			<div class="index-statictis__item">
				<div class="index-statictis__item-up grey">
					距离（米）
				</div>
				<div class="green index-statictis__item-down">
					<?=$step['distance']?>
				</div>
			</div>
			<div class="index-statictis__item">
				<div class="index-statictis__item-up grey">
					卡路里
				</div>
				<div class="green index-statictis__item-down">
					<?=$step['cal']?>
				</div>
			</div>
		</div>
		<div class="white-bg">
			<a class="index-record index-flex " href='<?=base_url().'Weixin/Index/record'?>'>
				<div class="flex-left">
					我的记录
				</div>
				<div class="flex-right">
					<i class="iconfont grey">&#xe80f;</i>
				</div>
			</a>
		</div>
		
		<div class="white-bg">
			<a class="index-credit index-flex " href='<?=base_url().'Weixin/Index/credit'?>'>
				<div class="flex-left">
					我的积分
				</div>
				<div class="flex-right">
					<i class="iconfont grey">&#xe80f;</i>
				</div>
			</a>
			<a class="index-setting index-flex " href='<?=base_url().'Weixin/Index/setting'?>'>
				<div class="flex-left">
					个人设置
				</div>
				<div class="flex-right">
					<i class="iconfont grey">&#xe80f;</i>
				</div>
			</a>
		</div>
		
	</div>
	<div id="actionSheet_wrap">
        <div class="weui_mask_transition" id="mask" style="z-index: 1000; background: rgba(0,0,0,.3)"></div>
        <div class="weui_actionsheet" id="weui_actionsheet" style="z-index: 1001">
            <div class="weui_actionsheet_menu">
                <div class="weui_actionsheet_cell" onclick="chooseImg()">更换背景</div>
            </div>
            <div class="weui_actionsheet_action">
                <div class="weui_actionsheet_cell" id="actionsheet_cancel">取消</div>
            </div>
        </div>
    </div>
    <div class="weui_dialog_confirm" style="display: none;" id="wrongMsg">
        <div class="weui_mask"></div>
        <div class="weui_dialog">
            <div class="weui_dialog_hd"><strong class="weui_dialog_title">提示</strong></div>
            <div class="weui_dialog_bd wrong-text"></div>
            <div class="weui_dialog_ft">
                <a href="#" id="wrongMsgBtn" class="weui_btn_dialog primary">确定</a>
            </div>
        </div>
    </div>
</body>
<script type="text/javascript" src="<?=HW_JS?>jquery-2.0.2.min.js"></script>
<script type="text/javascript" src="<?=HW_STA?>weui/weui.min.js"></script>
<script src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script src="<?=HW_JS?>rem.js"></script>
<script>
	$('.add_img').click(function () {
        $('#mask').show();
        $('.weui_actionsheet').animate({
            'bottom': '100px'
        });
    });
    $('#actionsheet_cancel').click(function () {
        $('#mask').hide();
        $('.weui_actionsheet').css({
            'bottom': '0'
        });
    });

	wx.config({
        debug: false,
        appId: "<?=$jsapi['appId']?>",
        timestamp: "<?=$jsapi['timestamp']?>",
        nonceStr: "<?=$jsapi['nonceStr']?>",
        signature: "<?=$jsapi['signature']?>",
        jsApiList: [
            'chooseImage',
            'previewImage',
            'uploadImage',
            'downloadImage',
            'onMenuShareTimeline',
            'onMenuShareAppMessage',
            'onMenuShareQQ',
            // 所有要调用的 API 都要加到这个列表中
        ]
    });
    // 图片上传，
    
    var image = {
        localId: "",
        serverId: "",
        status: "",
        num: 1,
        sum: 1 //最多上传图片数
    };

  
    function chooseImg() {
        if (image.num <= image.sum) {
            wx.ready(function () {
                wx.chooseImage({
                    //                    count: image.sum - image.num, // 默认9
                    count: 1, 
                    sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
                    sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
                    success: function (res) {
                        var localIds = res.localIds;
                        //  返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
                        // alert()
                        uploadImg(localIds);
                    }
                });
            });
        } else {
            $(".weui_dialog_bd").text("最多只能上传" + image.sum + "张");
            $("#wrongMsg").show();
        }
        $('#actionsheet_cancel').click();
    }

    function uploadImg(localIds) {
        // if (image.localId == "") {
        //     $(".weui_dialog_bd").text("请先选择图片");
        //     $(".weui_dialog_alert").show();
        //     return false;
        // }
        var img_localId = localIds.pop();
        wx.ready(function () {
            wx.uploadImage({
                localId: img_localId.toString(), // 需要上传的图片的本地ID，由chooseImage接口获得
                isShowProgressTips: 1, // 默认为1，显示进度提示
                success: function (res) {
                    image.serverId = res.serverId;
                    // 返回图片的服务器端ID
                    $.ajax({
                        url: "<?=base_url().'Api/Upload/downloadWxImage'?>",
                        type: "get",
                        data: {
                            'media_id': image.serverId,
                            'headimg': 1
                        },
                        dataType: "json",
                        success: function (json) {
                            // alert('成功');
                            // var data = JSON.parse(json);
                            if (json.code == 0) {
                                $(".weui_dialog_bd").text(json.msg);
                                $("#wrongMsg").show();
                                return false;
                            }else{
                                $(".index-panel").css('background', 'url("'+json.url+'")');
                                $('#actionsheet_cancel').click();
                            }

                            if(localIds.length>0){
                                uploadImg(localIds);
                            }else{
                                $(".img-box").each(function(i,item){
                                    if($(this).attr("aim") == '1'){
                                        $(this).attr('aim','0');
                                    }
                                });
                            }

                            
                        },
                        error: function () {
                            alert('失败');
                            $(".weui_dialog_bd").text("图片上传失败");
                            $("#wrongMsg").show();
                        }
                    });
                }
            });
        });
    }
</script>
</html>

